{extend name="../../../view/public/base" /}

{block name="body"}
<div class="bw-container">
    <div class="bw-main">
        <div class="layui-row layui-col-space15">
            <div class="layui-col-md12">
                <div class="layui-card">
                    <div class="layui-collapse" lay-filter="test">
                        <div class="layui-colla-item">
                            <h2 class="layui-colla-title"><i class="layui-icon">&#xe615;</i>查询条件</h2>
                            <div class="layui-colla-content">
                                <br>
                                <div class="demoTable layui-form ">
                                    <div class="layui-inline">
                                        <label class="layui-form-label">数据ID：</label>
                                        <div class="layui-inline">
                                            <input class="layui-input" type="number" name="id" id="id" autocomplete="off" placeholder="数据ID">
                                        </div>
                                    </div>
                                    <div class="layui-inline">
                                        <label class="layui-form-label">是否有效：</label>
                                        <div class="layui-input-inline">
                                            <select name="status" id="status" lay-verify="required">
                                                <option value="">请选择</option>
                                                <option value="1">有效</option>
                                                <option value="2">无效</option>
                                            </select>
                                        </div>
                                    </div>
                                    <div class="layui-inline">
                                        <label class="layui-form-label">时间范围：</label>
                                        <div class="layui-input-inline">
                                            <input type="text" class="layui-input time-picker" id="beginTime" placeholder="最小时间">
                                        </div>
                                    </div>
                                    ~
                                    <div class="layui-input-inline">
                                        <input type="text" class="layui-input time-picker" id="endTime" placeholder="最大时间">
                                    </div>
                                    <div class="layui-inline">
                                        <div class="layui-input-inline">
                                            &nbsp&nbsp&nbsp
                                            <button class="layui-btn layui-btn-sm   layui-btn-warm" onclick="reload()">搜索</button>
                                            <button class="layui-btn layui-btn-sm" onclick="reset()">重置</button>
                                        </div>
                                    </div>
                                    <br><br>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <div class="layui-col-md12">
                <div class="layui-card">
                    <!-- 列表上面按钮 -->
                    <script type="text/html" id="toolbarDemo">
                        <div class="layui-btn-container tbtn">
                            <button class="layui-btn layui-btn-danger layui-btn-sm" type="button" onclick="del('all')"><i class="layui-icon">&#xe640;</i>批量删除</button>

                            <button class="layui-btn layui-btn-sm  layui-btn-normal" onclick="edit('all')">添加</button>
                            <button class="layui-btn layui-btn-sm" onclick="reset()">重置</button>

                        </div>
                    </script>
                    <!-- 列表 -->
                    <table class="layui-table" lay-data="{toolbar:'#toolbarDemo',url:'{:Url('getconfiglist')}?return_type=old_json&group_id={$group_id}&dir={$dir}',method:'post',page:true,id:'templateList'}" lay-filter="templateList">
                        <thead>
                        <tr>
                            <th lay-data="{type:'checkbox',fixed: 'left'}"></th>
                            <th lay-data="{field:'id', sort: true}">ID</th>
                            {volist name="show.config_list" id="config" key="i"}
                            <!--循环添加-->
                            {switch name="config.type"}
                            {case value="text"}
                            {switch name="config.input_type"}
                            {case value="text"}
                            <!--普通文本框-->
                            <th lay-data="{field:'{$config.config_name}', sort: true   {gt name=" $i
                            " value="7" },hide:true{/gt}}">{$config.info}</th>
                            {/case}
                            {case value="number"}
                            <!--数字文本框-->
                            <th lay-data="{field:'{$config.config_name}', sort: true {gt name=" $i
                            " value="7" },hide:true{/gt}}">{$config.info}</th>
                            {/case}
                            {case value="timestamp"}
                            <!--日期-->
                            <th lay-data="{field:'{$config.config_name}', sort: true, templet: '#{$config.config_name}_timestamp'{gt name=" $i
                            " value="7" },hide:true{/gt} }">{$config.info}</th>
                            {/case}
                            {case value="color"}
                            <!--颜色选择器-->
                            <th lay-data="{field:'{$config.config_name}', sort: true, templet: '#{$config.config_name}_color' {gt name=" $i
                            " value="7" },hide:true{/gt} }">{$config.info}</th>
                            {/case}

                            {case value="float"}
                            <!--浮点数-->
                            <th lay-data="{field:'{$config.config_name}', sort: true   {gt name=" $i
                            " value="7" },hide:true{/gt}}">{$config.info}</th>
                            {/case}

                            {default /}
                            {/switch}

                            {/case}

                            {case value="textarea"}
                            <!--多行文本框-->
                            <th lay-data="{field:'{$config.config_name}', sort: true ,hide:true}">{$config.info}</th>
                            {/case}

                            {case value="r_textarea"}
                            <!--富文本框-->

                            {/case}

                            {case value="radio"}
                            <!--单选框-->
                            <th lay-data="{field:'{$config.config_name}', sort: true, templet: '#{$config.config_name}_radio' {gt name=" $i
                            " value="7" },hide:true{/gt} }">{$config.info}</th>
                            {/case}

                            {case value="checkbox"}
                            <!--复选框-->
                            <th lay-data="{field:'{$config.config_name}', sort: true, templet: '#{$config.config_name}_checkbox' {gt name=" $i
                            " value="7" },hide:true{/gt} }">{$config.info}</th>
                            {/case}

                            {case value="select"}
                            <!--下拉框-->
                            <th lay-data="{field:'{$config.config_name}', sort: true, templet: '#{$config.config_name}_select' {gt name=" $i
                            " value="7" },hide:true{/gt} }">{$config.info}</th>
                            {/case}

                            {case value="upload"}
                            <!--上传-->
                            {switch name="config.upload_type"}

                            {case value="1"}
                            <!--单图-->
                            <th lay-data="{field:'{$config.config_name}', sort: true, templet: '#{$config.config_name}_upload_type_1' {gt name=" $i
                            " value="7" },hide:true{/gt} }">{$config.info}</th>
                            {/case}
                            {case value="2"}
                            <!--多图-->
                            <th lay-data="{field:'{$config.config_name}', sort: true, templet: '#{$config.config_name}_upload_type_2' {gt name=" $i
                            " value="7" },hide:true{/gt} }">{$config.info}</th>
                            {/case}

                            {case value="3"}
                            <!--文件-->
                            <th lay-data="{field:'{$config.config_name}', sort: true, templet: '#{$config.config_name}_upload_type_3' {gt name=" $i
                            " value="7" },hide:true{/gt} }">{$config.info}</th>
                            {/case}

                            {default /}
                            {/switch}
                            {/case}

                            {default /}
                            {/switch}

                            {/volist}
                            <th lay-data="{field:'sort', sort: true}">权重</th>
                            <th lay-data="{field:'status', templet: '#status2' }">是否有效</th>
                            <th lay-data="{field:'add_time', sort: true, templet: '#add_time'}">创建时间</th>
                            <th lay-data="{fixed: 'right', width:200,  align:'center', toolbar: '#barDemo'}">操作</th>
                        </tr>
                        </thead>
                    </table>

                    {volist name="show.config_list" id="config" key="i"}
                    <!--循环添加-->
                    {switch name="config.type"}
                    {case value="text"}
                    {switch name="config.input_type"}
                    {case value="text"}
                    <!--普通文本框-->
                    {/case}
                    {case value="number"}
                    <!--数字文本框-->
                    {/case}
                    {case value="timestamp"}
                    <!--日期-->
                    <script type="text/html" id="{$config.config_name}_timestamp">
                        {{#  if(d.{$config.config_name} != null&&d.{$config.config_name} != 0){ }}
                        <span>{{ getLocalTime(d.{$config.config_name},"yyyy-MM-dd")}}</span>
                        {{#  } else { }}
                        <span style="color: #c2c2c2"> 无数据</span>
                        {{#  } }}
                    </script>
                    {/case}
                    {case value="color"}
                    <!--颜色选择器-->
                    <script type="text/html" id="{$config.config_name}_color">
                        {{#  if(d.{$config.config_name} != null&&d.{$config.config_name} != 0&&d.{$config.config_name} != ''){ }}
                        <span class="layui-badge" style="background-color: {{d.{$config.config_name}}}"><i class="layui-icon">&#xe66a;</i>&nbsp{{d.{$config.config_name}}}</span>
                        <span> </span>
                        {{#  } else { }}
                        <span style="color: #c2c2c2"> 无数据</span>
                        {{#  } }}

                    </script>
                    {/case}
                    {case value="float"}
                    <!--浮点数-->
                    {/case}

                    {default /}
                    {/switch}

                    {/case}

                    {case value="textarea"}
                    <!--多行文本框-->

                    {/case}
                    {case value="r_textarea"}
                    <!--富文本框-->

                    {/case}
                    {case value="radio"}
                    <!--单选框-->
                    <script type="text/html" id="{$config.config_name}_radio">
                        {{#  if(d.{$config.config_name} != null&&d.{$config.config_name} != ''){ }}
                        {volist name="config.parameter" id="index"}
                        {{#  if(d.{$config.config_name} == {$index.value}){ }}
                        <span class="layui-badge layui-bg-orange">{$index.key}</span>
                        {{#  } }}

                        {/volist}


                        {{#  } else { }}
                        <span style="color: #c2c2c2"> 无数据</span>
                        {{#  } }}
                    </script>
                    {/case}

                    {case value="checkbox"}
                    <!--复选框-->
                    <script type="text/html" id="{$config.config_name}_checkbox">
                        {{#  if(d.{$config.config_name} != null&&d.{$config.config_name} != ''){ }}
                        {volist name="config.parameter" id="index"}
                        {if condition="strpos($config.value,$index.value)!==false"}checked="" {/if}
                        {{#  if( d.{$config.config_name}.indexOf('{$index.value}')!=-1){ }}
                        <span class="layui-badge layui-bg-cyan">{$index.key}</span>
                        {{#  } }}

                        {/volist}

                        {{#  } else { }}
                        <span style="color: #c2c2c2"> 无数据</span>
                        {{#  } }}
                    </script>
                    {/case}

                    {case value="select"}
                    <!--下拉框-->
                    <script type="text/html" id="{$config.config_name}_select">
                        {{#  if(d.{$config.config_name} != null&&d.{$config.config_name} != ''){ }}
                        {volist name="config.parameter" id="index"}
                        {{#  if(d.{$config.config_name} == {$index.value}){ }}
                        <span class="layui-badge">{$index.key}</span>
                        {{#  } }}

                        {/volist}

                        {{#  } else { }}
                        <span style="color: #c2c2c2"> 无数据</span>
                        {{#  } }}
                    </script>
                    {/case}

                    {case value="upload"}
                    <!--上传-->
                    {switch name="config.upload_type"}

                    {case value="1"}
                    <!--单图-->
                    <script type="text/html" id="{$config.config_name}_upload_type_1">
                        {{#  if(d.{$config.config_name} != null&&d.{$config.config_name} != ''){ }}
                        {{ getImgs(d.{$config.config_name},1)}}
                        {{#  } else { }}
                        <span style="color: #c2c2c2"> 无数据</span>
                        {{#  } }}
                    </script>
                    {/case}

                    {case value="2"}
                    <!--多图-->
                    <script type="text/html" id="{$config.config_name}_upload_type_2">
                        {{#  if(d.{$config.config_name} != null&&d.{$config.config_name} != ''){ }}
                        {{ getImgs(d.{$config.config_name},2)}}
                        {{#  } else { }}
                        <span style="color: #c2c2c2"> 无数据</span>
                        {{#  } }}
                    </script>
                    {/case}

                    {case value="3"}
                    <!--文件-->
                    <script type="text/html" id="{$config.config_name}_upload_type_3">
                        {{#  if(d.{$config.config_name} != null&&d.{$config.config_name} != ''){ }}
                        {{ getImgs(d.{$config.config_name},3)}}
                        {{#  } else { }}
                        <span style="color: #c2c2c2"> 无数据</span>
                        {{#  } }}
                    </script>
                    {/case}

                    {default /}
                    {/switch}
                    {/case}

                    {default /}
                    {/switch}
                    {/volist}
                    <script type="text/html" id="status2">
                        <input type="checkbox" name="status" value="{{d.id}}" templateType="{{d.status}}" lay-skin="switch" lay-text="有效|无效" lay-filter="state" {{ d.status== 1 ? 'checked' : '' }}>
                    </script>
                    <script type="text/html" id="add_time">
                        {{#  if(d.add_time != null&&d.add_time != 0){ }}<span>{{ getLocalTime(d.add_time,"yyyy-MM-dd")}}</span>{{#  } }}
                    </script>
                    <script type="text/html" id="barDemo">

                        <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="edit" title="编辑">编辑</a>
                        <a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="del" title="删除">删除</a>
                    </script>
                </div>
            </div>
        </div>
    </div>
</div>
<script>
    var table;
    var laydate;
    var form;
    var element;

    layui.use(['form', 'table', 'laydate', 'element'], function () {
        table = layui.table;
        form = layui.form;
        laydate = layui.laydate;
        element = layui.element;
        reset()
        //监听工具条
        table.on('tool(templateList)', function (obj) {
            var data = obj.data;
            if (obj.event === 'del') {
                del(data.id);
            } else if (obj.event === 'edit') {
                edit(data.id);
            }
        });
        //日期范围
        var begin = laydate.render({
            elem: '#beginTime',
            type: 'datetime',
            format: 'yyyy-MM-dd HH:mm',
            btns: ['clear', 'confirm'],
            done: function (value, date) {
                if (date.year) {
                    end.config.min = {
                        year: date.year,
                        month: date.month - 1,
                        date: date.date,
                        hours: date.hours,
                        minutes: date.minutes,
                        seconds: 0
                    }
                } else {
                    end.config.min = {
                        year: 1970,
                        month: 1,
                        date: 1,
                        hours: 23,
                        minutes: 59,
                        seconds: 59
                    }
                }
            }
        });
        var end = laydate.render({
            elem: '#endTime',
            type: 'datetime',
            format: 'yyyy-MM-dd HH:mm',
            btns: ['clear', 'confirm'],
            done: function (value, date) {
                if (date.year) {
                    begin.config.max = {
                        year: date.year,
                        month: date.month - 1,
                        date: date.date,
                        hours: date.hours,
                        minutes: date.minutes,
                        seconds: 0
                    }
                } else {
                    begin.config.max = {
                        year: 2099,
                        month: 12,
                        date: 31,
                        hours: 59,
                        minutes: 59,
                        seconds: 59
                    }
                }
            }
        });

        form.render("select");

        form.on('switch(state)', function (obj) {
            tipText = "操作成功";
            var emelment = $('.layui-form-switch');

            if (isClick) {
                isClick = false;
                var templateType = this.getAttribute("templateType");
                setBoxState(this.value, templateType, true);

                if (result.data.errcode != 0) {
                    layer.msg('操作失败！请联系管理员或稍后再试。', {
                        icon: 5,
                        time: 1000
                    });
                } else {
                    layer.msg(tipText, {
                        icon: 6,
                        time: 1500
                    });
                }
                for (var i = 0; i < emelment.length; i++) {
                    $(emelment[i]).addClass('layui-disabled');
                    $(emelment[i]).unbind();
                }
                setTimeout(function () {
                    isClick = true;
                    curr = $('.layui-laypage-em').next().text();
                    reload();
                }, 1500);
            } else {
                layer.msg('请不要操作太频繁！', {
                    icon: 5,
                    time: 1000
                });
            }
        });

    });

    //设置推荐
    function setBoxState(id, templateType, state) {
        $.ajax({
            url: "/manage/groupData/setConfigShow",
            type: "post",
            data: {id: id, state: state, status: templateType, app: '{$dir}'},
            async: false,
            success: function (data) {
                result = data;
            }
        });
    }

    //获取所选中的ID
    function getCheckData() {
        var checkStatus = table.checkStatus('templateList'), data = checkStatus.data;
        var obj = [];
        for (var i = 0; data.length > i; i++) {
            obj.push(data[i].id);
        }
        layer.alert(JSON.stringify(obj));
    }

    //获取重载列表
    function reload() {
        var beginTime = $("#beginTime").val();
        var endTime = $("#endTime").val();
        var status = $('#status').val();
        var id = $('#id').val();
        // document.getElementById("beginTime").value = '';
        // document.getElementById("endTime").value = '';

        table.reload('templateList', {
            where: { //设定异步数据接口的额外参数
                beginTime: beginTime
                , endTime: endTime
                , id: id
                , status: status
            }, page: {curr: 1}
        });
    }

    //重置
    function reset() {
        document.getElementById("beginTime").value = '';
        document.getElementById("endTime").value = '';
        document.getElementById("status").value = '';
        document.getElementById("id").value = '';
        //执行清空
        // $("#templateType").empty();
        form.render("select");
        //render();
        table.reload('templateList', {
            where: { //设定异步数据接口的额外参数
                beginTime: null
                , endTime: null
                , id: null
                , status: null
            }, page: {curr: 1}
        });
    }

    //新增或修改
    function edit(id) {
        var currentPage = $('.layui-laypage-em').next().text();
        var title = 'ID:' + id + "数据查看";
        var url = "{:Url('edit')}?id=" + id + "&group_id={$group_id}&app={$dir}";
        var post_url = "{:Url('edit')}?app={$dir}";
        if (id == 'all') {
            title = '新增';
            url = "{:Url('add')}?group_id={$group_id}&app={$dir}";
            post_url = "{:Url('add')}?app={$dir}";
        }
        layer.open({
            type: 2,
            title: title,
            shade: 0.2,
            maxmin: true,
            area: ['90%', '90%'],
            content: url,
            btn: ['立即提交'],
            yes: function (index, layero) {
                var nodeName = window["layui-layer-iframe" + index];
                var id = nodeName.getId();
                var Data = nodeName.getSaveData();
                isClick = false;
                if (Data != false) {
                    $.ajax({
                        url: post_url,
                        type: "post",
                        data: Data,
                        success: function (data) {
                            //console.log(data.status);
                            if (data.data.errcode == 0) {
                                layer.close(index);
                                layer.msg('处理中...', {shade: [0.2, '#393D49'], time: 60 * 60 * 2000});
                                layer.msg('提交成功', {
                                    icon: 6,
                                    time: 1000 //1.5秒关闭（如果不配置，默认是3秒）
                                });
                                setTimeout(function () {
                                    isClick = true;
                                    layer.close(index);
                                    if (id != null && id != '') {
                                        curr = currentPage;
                                        reload();
                                    } else {
                                        reset();
                                    }
                                }, 1500);
                            } else if (data.data.errcode != 0) {
                                layer.msg(data.msg, {
                                    icon: 5,
                                    time: 1500 //1.5秒关闭（如果不配置，默认是3秒）
                                });
                                isClick = true;
                            } else {
                                layer.msg('操作失败！请稍后再试。', {
                                    icon: 5,
                                    time: 1500 //1.5秒关闭（如果不配置，默认是3秒）
                                });
                                isClick = true;
                            }
                        }
                    });
                }


            }
        });
    }

    function getLocalTime(nS) {
        return new Date(parseInt(nS) * 1000).toLocaleString().replace(/年|月/g, "-").replace(/日/g, " ");
    }

    var isClick = true;

    //删除
    function del(id) {
        var ids = new Array();
        if (id == 'all') {
            var checkStatus = table.checkStatus('templateList');
            var data = checkStatus.data;
            if (data == 0) {
                layer.alert('请选择');
                return;
            }
            for (var i = 0; i < data.length; i++) {
                ids[i] = data[i].id;
            }
        } else {
            ids[0] = id;
        }
        if (isClick) {
            layer.confirm('真的要删除么', function (index) {
                isClick = false;
                layer.close(index);
                $.ajax({
                    url: "{:Url('softdleting')}",
                    type: "post",
                    data: {"ids": ids.toString(), 'app': "{$dir}"},
                    success: function (data) {
                        layer.close(index);
                        if (data.data.errcode == 0) {
                            layer.msg('删除成功', {
                                icon: 6,
                                time: 1500 //1.5秒关闭（如果不配置，默认是3秒）
                            });
                            setTimeout(function () {
                                isClick = true;
                                reload();
                            }, 1500);
                        } else if (data == 'nullValueFail') {
                            isClick = true;
                            layer.msg('操作失败！请联系管理员。', {
                                icon: 5,
                                time: 1500 //1.5秒关闭（如果不配置，默认是3秒）
                            });
                        } else if (data == 'paramFail') {
                            isClick = true;
                            layer.msg('操作失败！请删除分类下所有配置再重试。', {
                                icon: 5,
                                time: 1500 //1.5秒关闭（如果不配置，默认是3秒）
                            });
                        } else {
                            isClick = true;
                            layer.msg('未知错误。', {
                                icon: 5,
                                time: 1500 //1.5秒关闭（如果不配置，默认是3秒）
                            });
                        }
                    }, error: function () {

                    }
                });
            });
        }
    }

    function HTMLDecode(text) {
        var temp = document.createElement("div");
        temp.innerHTML = text;
        var output = temp.innerText || temp.textContent;
        temp = null;
        return output;
    }

    function openimgs(that) {
        //页面层-图片
        layer.open({
            type: 1,
            title: false,
            closeBtn: 0,
            area: ['auto'],
            skin: 'layui-layer-nobg', //没有背景色
            shadeClose: true,
            content: '<img  src="' + that.getAttribute('src') + '">'
        });

    }

    /**
     * 返回一组图片标签
     */
    function getImgs(json_data, type) {
        console.log(json_data);
        var rs = '';
        //单图
        if (type == 1) {
            //得到图片
            rs = '<img src="' + json_data.src + '" style="border-radius:50%" class="layui-upload-img" width="25" height="25" onclick="openimgs(this)">';
        }
        //多图
        if (type == 2) {
            for (img in json_data) {
                rs += '<img src="' + json_data[img].src + '" style="border-radius:50%" class="layui-upload-img" width="25" height="25" onclick="openimgs(this)">&nbsp&nbsp';
            }

        }
        //单文件
        if (type == 3) {

            rs += '<span class="layui-badge layui-bg-green">文件名：' + json_data.name + '</span>';
            rs += '<span class="layui-badge layui-bg-blue">大小：' + (json_data.size / 1024) + 'kb</span>';
        }

        return rs;
    }
</script>
{/block}